import 'package:flutter/material.dart';

class HideAndShowPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return HideAndShowPageFul();
  }
}

class HideAndShowPageFul extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _HideAndShowPageState();
  }
}

class _HideAndShowPageState extends State<HideAndShowPageFul> {
  bool visible = true;

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('widget显示与隐藏'),
        centerTitle: true,
      ),
      body: new ListView(
        children: <Widget>[
          new Padding(
            padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
            child: new RaisedButton(
                textColor: Colors.black,
                child: new Text(visible ? '隐藏B    显示A' : '隐藏A   显示B'),
                onPressed: () {
                  visible = !visible;
                  setState(
                      () {}); //  setState(() { visible = !visible;});为什么不这样写也可以
                }),
          ),
          new Padding(
            padding: const EdgeInsets.only(left: 10.0, top: 10.0, right: 10.0),
            child: new Column(
              children: <Widget>[
                new TestAWidget(
                  visible: visible,
                ),
                TestCWidget(visible: !visible),
                _buildA()
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildA() {
    var content;
    if (visible) {
      //如果数据不为空，则显示Text
      content = new Text('数据不为空');
    } else {
      //当数据为空我们需要隐藏这个Text
      //我们又不能返回一个null给当前的Widget Tree
      //只能返回一个长宽为0的widget占位
      content = new Container(height: 0.0, width: 0.0);
    }
    return content;
  }
}

class TestAWidget extends StatelessWidget {
  final bool visible;

  const TestAWidget({Key key, this.visible}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return AnimatedOpacity(
      duration: Duration(milliseconds: 300),
      opacity: visible ? 1.0 : 0.0,
      child: new Container(
        color: Colors.blue,
        height: 100.0,
        child: new Center(
          child: new Text(visible ? 'TestAWidget' : "TestBWidget"),
        ),
      ),
    );
  }
}

class TestCWidget extends StatelessWidget {
  final bool visible;

  const TestCWidget({Key key, this.visible}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return new Offstage(
      offstage: visible,
      child: new Container(
        color: Colors.orange,
        height: 100.0,
        child: new Center(
          child: new Text('TestCWidget'),
        ),
      ),
    );
  }
}
